<template>
	<view class="container">
		<z-paging ref="pagingRef" :paging-style="{'height':'91vh'}" :fixed="false" v-model="inviteList"
			@query="handleQueryList">
			<view class="cu-list menu-avatar" >
				<view class="cu-item" v-for="(item,index) in inviteList" :key="index">
					<view class="cu-avatar round lg" :style="{backgroundImage:'url('+item.avatarUrl+');'}"></view>
					<view class="content">
						<view class="text-grey">{{item.nickname}}</view>
						<view class="text-gray text-sm flex">
							<view class="text-cut">
								<text class="cuIcon-calendar margin-right-xs"></text>
								{{item.createTime}}
							</view> 
						</view>
						<view class="text-gray text-sm flex">
							<view class="text-cut">
								<text class="cuIcon-phone margin-right-xs"></text>
								{{item.phone}}
							</view> 
						</view>
					</view>
					<view class="action">
						<view v-if="item.inviteUserMode==1" class="cu-tag round bg-grey sm">首单</view>
						<view v-else class="cu-tag round bg-grey sm">长期</view>
					</view>
				</view>
			</view>
		</z-paging>
		<view style="height: 50px;"></view>
		<view class="footer-menu">
			<view class="padding flex justify-center">
				<button open-type="share" class="cu-btn flex-sub bg-menu lg round margin-lr-sm">邀请好友</button>
			</view>
		</view>
	</view>
</template>

<script setup lang="ts">
	import { ref } from 'vue';
	import { useSettingStore } from '@/stores/index';
	import { onShow, onShareAppMessage, onPullDownRefresh } from '@dcloudio/uni-app';
	import { accountInfo, page, rebateMode } from '@/common/api/user'
	import zPaging from '@/components/cu-refresh/z-paging/z-paging.vue'
	const setting = useSettingStore();
	const radioValue = ref('0');
	onShareAppMessage((res) => {
		if (res.from === 'button') {// 来自页面内分享按钮
			console.log(res.target)
		}

		return {
			withShareTicket: false,
			title: '邀请您体验小程序',
			content: '源社区,你的社区生活管家',
			imageUrl: '',
			path: '/pages/index/index?inviteUserId=' + setting.userInfo.id,
			success: (res : any) => {

			},
			fail: (res : any) => {

			},
			complete: (res : any) => {

			}
		}
	})
	const userinfo = ref({
		"id": 0,
		"username": "",
		"realName": "",
		"nickname": "",
		"avatarUrl": "",
		"phone": "",
		"address": "",
		"email": "",
		"birthday": "",
		"gender": 1,
		"roleKeys": [],
		"msgNum": "0",
		"surplus": 0.00,
		"integral": 0

	})
	const inviteTotal = ref(0)
	const onLoadUser = async () => {
		const res : any = await accountInfo({});
		if (res.code == 1000) {
			userinfo.value = res.data
			setting.userInfo = res.data
			if (res.data.rebateMode) {
				radioValue.value = res.data.rebateMode
			}
			queryParams.value.inviteUserId = userinfo.value.id
			//onList()
			handleCheckedUser()
		}
	}
	const handleCheckedUser = () => {
		if ((!userinfo.value.phone) || userinfo.value.phone.length == 0) {
			uni.showModal({
				title: '提示',
				content: "参加平台分佣需要完善用户信息，是否立即完善？",
				confirmText: "立即完善",
				cancelText: "暂不完善",
				success: (res : any) => {
					if (res.confirm) {
						uni.navigateTo({
							url: '/pages/my/info'
						})
					} else if (res.cancel) {
						uni.navigateBack()
					}
				}
			})
		}
		if (userinfo.value.nickname.indexOf('WX_') != -1 || userinfo.value.nickname.length == 0) {
			uni.showModal({
				title: '提示',
				content: "参加平台分佣需要完善用户信息，是否立即完善？",
				confirmText: "立即完善",
				cancelText: "暂不完善",
				success: (res : any) => {
					if (res.confirm) {
						uni.navigateTo({
							url: '/pages/my/info'
						})
					} else if (res.cancel) {
						uni.navigateBack()
					}
				}
			})
		}
	}
	const inviteList = ref([
		{

			"id": 0,
			"username": "",
			"deptId": 0,
			"deptName": "",
			"password": "",
			"roleIds": [],
			"roleNames": "",
			"nickname": "",
			"realName": "",
			"phone": "",
			"idCard": "",
			"birthday": "",
			"address": "",
			"avatarUrl": "",
			"email": "",
			"gender": 0,
			"disabled": true,
			"state": 0,
			"opinion": "",
			"description": "",
			"surplus": 0,
			"integral": 0,
			"createTime": ""

		}
	]);
	const handleRefresh = () => {
		pagingRef.value.reload();
	};
	onPullDownRefresh(() => {
		inviteList.value=[]
		handleRefresh();
	});
	const queryParams = ref({
		page: 1,
		size: 20,
		name: "",
		inviteUserId: 0
	});
	const pagingRef = ref()
	const handleQueryList = async (pageNo : any, pageSize : any) => {
		queryParams.value.page = pageNo
		queryParams.value.size = pageSize
		onList()
	}
	const onList = async () => {
		const res : any = await page(queryParams.value);
		if (res.code == 1000) {
			pagingRef.value.complete(res.data.rows);
		} else {
			pagingRef.value.complete(false);
		}
		uni.stopPullDownRefresh();
	};
	onShow(() => {
		onLoadUser()
	});
</script>

<style scoped>
	.u-bg {
		color: #ffffff;
		background: linear-gradient(180deg, #356FFD 0%, #66A8FF 100%);
		padding-bottom: 120rpx;
	}

	.u-bg .w-txt {
		font-size: 28rpx;
		margin-top: 70rpx;
		padding-left: 60rpx;
	}

	.u-bg .w-txt image {
		width: 24rpx;
		height: 28rpx;
	}

	.u-cen {
		background: #fff;
		border-radius: 20rpx;
		color: #222222;
		padding: 20rpx 30rpx;
	}

	.w-mar {
		margin: -100rpx 30rpx 0;
	}

	.w-mar2 {
		margin: 40rpx 30rpx;
		padding: 40rpx 30rpx 0rpx;
	}

	.u-cen .w-balance {
		border-bottom: 1rpx solid rgba(0, 0, 0, 0.2);
		padding: 40rpx 0;
		font-size: 28rpx;
	}

	.u-cen .w-balance .w-txt1 {
		font-weight: 400;
		color: #222222;
		font-size: 54rpx;
		line-height: 58rpx;
	}

	.u-cen .w-balance .w-txt2 {
		font-weight: 400;
		font-size: 54rpx;
		line-height: 58rpx;
		text-align: center;
	}

	.w-b {
		padding: 60rpx 0;
	}

	.w-b button {
		width: 300rpx;
		height: 96rpx;
		line-height: 96rpx;
		background: #FFFFFF;
		border-radius: 12rpx;
		font-size: 40rpx;
		font-weight: bold;
		color: #222222;
	}

	.w-b .w-but {
		background: #4287FC;
		color: #ffffff;
		border: 0;
	}

	.u-cen .w-fon1 {
		color: #999999;
		font-size: 32rpx;
	}

	.u-cen .w-list .w-fon1 {
		margin-top: 6rpx;
	}

	.u-cen .w-list {
		margin: 50rpx 0;
	}
</style>